import {getCateData} from '../../services/category'
import regeneratorRuntime from '../../lib/runtime/runtime.js'
// pages/category/index.js
Page({

  /**
   * 页面的初始数据
   */
  data: {
    // 左侧的菜单数据
    leftData:[],
    // 右侧的商品数据
    rightContent:[],
    // 重置右侧滚动高度
    scrollTop:0
  },
  cates:[],
  /**
   * 生命周期函数--监听页面加载
   */
  onLoad: function (options) {
    /*
      0 web中的本地存储和小程序中的本地存储区别
        1.写代码的方式不一样
          web:localStorage.setItem('key','value') localStorage.getItem('key')
        2.wx.setStorageSync('key', data) wx.getStorageSync('key')
        3.存的时候没有类型的转换
          web:不管存入什么类型的数据，最终都会先调用toString()，把数据变成字符串类型再存进去
          小程序:不存在类型转换，你传入什么得到的就是什么
      1 先判断本地存储中有没有旧的数据
      {time:Data.now(),data:[...]}
      2 没有就数据直接发送新的请求
      3 有旧数据也没有过期 就使用本地存储中的旧数据
      
    */
  
   // 1 获取本地存储数据
   const Cates = wx.getStorageSync('cates')
   // 2 不存在 发送请求获取数据
   if(!Cates){
    this._getCateData()
   }else{
   
     // 有旧的数据 定义过期时间 10s 改成5min
     if(Date.now() - Cates.time>1000*10){
       // 重新发送请求
       this._getCateData()
     }else{
       console.log('使用旧数据')
       this.cates = Cates.data;
       let leftData = this.cates.map(item=>item.cat_name)
       // 右侧商品数据
       console.log(this.cates)
       let rightContent = this.cates[0].children
       this.setData({
         leftData,
         rightContent
       })
     }
   }
    
  },
  // es6 promise语法
  // _getCateData(){
  //   getCateData().then(res=>{
  //    const data = res.data.message
  //    this.cates = data
  //    wx.setStorageSync('cates', {time:Date.now(),data:this.cates})
  //   //初始化数据
  //   this.getLeftMenu()
  //   this.getRightContent(0) 
  //   })
   
  // },
  // es7 async语法
  async _getCateData(){
    const res = await getCateData()
    const data = res.data.message
     this.cates = data
     wx.setStorageSync('cates', {time:Date.now(),data:this.cates})
    //初始化数据
    this.getLeftMenu()
    this.getRightContent(0) 
  },
  getLeftMenu(){
    //左侧菜单数据
    let leftData = this.cates.map(item=>item.cat_name)
    this.setData({
      leftData
    })
  },
  getRightContent(index){
    // 右侧商品数据
    let rightContent = this.cates[index].children
    this.setData({
      rightContent
    })
  },
  // 菜单点击事件
  handleIndex(e){
    const index = e.detail.index
    this.getRightContent(index)
    this.setData({
      scrollTop:0
    })
  },

  
})